<template>
	<view class="shop-img">
		<view class="box">
			<view class="title">
				<text>请上传相关部门认证照片<text>(最多3张)</text></text>
			</view>
			<view class="upLoadImg">
				<!-- v-for="(item,index) in imgList" :key="index" -->
				<!-- <view class="img1"> -->
					<sunuiupimg @change="getImageInfo" :upload_auto="true" :upimg_move="true" ref="upimg"></sunuiupimg>
					<!-- <image :src="item" mode="aspectFill" @click="previewImg(index)"></image>
					<view class="remove" @click="removeImg(index)">
						<text class="iconfont remove-img">&#xe628;</text>
					</view> -->
				<!-- </view> -->
				
				<view class="img" @click="chooseImg">
					<text class="iconfont icon">&#xe641;</text>
				</view>
				
			</view>
			<view class="tips">
				<text>上传照片更能得到用户的认可，信任</text>
			</view>
			<view class="btn">
				<button type="primary" size="mini" @click="onConfirm">确认上传</button>
			</view>
		</view>
	</view>
</template>

<script>
	let _self = this;
	import sunuiupimg from '@/components/sunui-upimg/sunui-upimg.vue';
	export default {
		components: {
			sunuiupimg
		},
		mounted() {
			this.$refs.upimg.upload_count = 3;
			this.$refs.upimg.upload_img_wh = 180;
			this.$refs.upimg.upload_cache_list = [];
		},
		data() {
			return {
				imgUrls: []
			}
		},

		methods: {
			getImageInfo(e) { //获取上传后的url，发生改变时候触发
				this.imgUrls = e;
			},
			chooseImg() { // 组件中的选择图片
				if(this.imgUrls.length >= 3) {
					uni.showToast({
						title: '最多只能添加3张',
						icon:'none'
					})
					return
				}
				this.$refs.upimg.chooseImage();
			},
			async onConfirm() {
				let a = await this.$http.setShopAuthImg({authimg: this.imgUrls});

				if(a.code == 200) {
					uni.showToast({
						title: a.message,
						icon: 'none'
					})
					setTimeout(() => {
						uni.navigateBack()
					}, 500)
				}
				uni.showToast({
					title: a.message,
					icon: 'none'
				})
			},

			
			uploadImg1() { // 先上传图片
				var _self = this;
				this.imgList.forEach((item) => { //循环上传图片
					uni.uploadFile({
						url: _self.$common.baseUrl.setUploadImg,
						filePath: item,
						name: 'file',
						success: (res) => {
							if (res.statusCode !== 200) {
								this.imgUrls = []
								return
							}
							res = JSON.parse(res.data)
							if (res.code == 200) {
								this.imgUrls.push(res.data.file)
								console.log(this.imgUrls)
							}
						}
					});
				});
			},
			chooseImg1() { //选择图片
				let _self = this;
				uni.chooseImage({
					count: 3 - _self.imgList.length, //默认9
					sizeType: ['original'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: function(res) {
						let a = res.tempFilePaths
						console.log(a)
						_self.imgList = _self.imgList.concat(a)
					}
				});
			},
			previewImg(index) { //图片预览
				uni.previewImage({
					urls: this.imgList,
					current: index,
					indicator: 'number'
				});
			},
			removeImg(index) { // 移除图片
				this.imgList.splice(index, 1)
			},


		}
	}
</script>

<style lang="scss" scoped>
	@import 'static/css/myStore.scss';
</style>
